FlyTalk.views.BoredView = Ext.extend(Ext.Panel, {
	fullscreen: true,
	
    initComponent: function () {
		
		// form buttons
        this.suggestButton = new Ext.Button({
        	text: 'Suggest<br/>something<br/>to do',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.suggestButtonTap,
			hidden: true,
			scope: this
        });
        
        this.reviewButton = new Ext.Button({
        	text: 'Review a restaurant',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.reviewButtonTap,
			hidden: true,
			scope: this
        });
        
        this.askButton = new Ext.Button({
        	text: 'Ask a question',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.askButtonTap,
			hidden: true,
			scope: this
        });
        
        this.commentButton = new Ext.Button({
        	text: 'Make a comment',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.commentButtonTap,
			hidden: true,
			scope: this
        });
        
        // hidden
        this.opened = new Ext.Button({
        	title: 'opened',
			ui: 'small',
			hidden: true,
			scope: this
        });
        
        this.ind = new Ext.Button({
        	title: 'ind',
			ui: 'small',
			hidden: true,
			scope: this
        });
        
        // buttons for overlay 
        this.followButton = new Ext.Button({
        	text: 'Follow this post',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.followButtonTap,
			scope: this
        });
    	
    	this.unfollowButton = new Ext.Button({
    		text: 'Unfollow this post',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.unfollowButtonTap,
			scope: this
        });
    	
    	this.replyButton = new Ext.Button({
    		text: 'Reply to this post',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.replyButtonTap,
			scope: this
        });
    	
    	this.upButton = new Ext.Button({
    		text: 'Thumbs up',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.upButtonTap,
			scope: this
        });
    	
    	this.downButton = new Ext.Button({
    		text: 'Thumbs down',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.downButtonTap,
			scope: this
        });
    	
    	this.threadButton = new Ext.Button({
    		text: 'See conversation',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.threadButtonTap,
			scope: this
        });
    	
    	this.locButton = new Ext.Button({
    		text: 'View location',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 0 3px',
			handler: this.locButtonTap,
			scope: this
        });
    	
    	this.cancelButton = new Ext.Button({
    		text: 'Cancel',
			ui: 'normal',
			width: 200,
			style: 'margin: 3px 3px 3px 3px',
			handler: this.cancelButtonTap,
			scope: this
        });
        
        // overlay
        this.overlay = new Ext.Panel({
            floating: true,
            modal: true,
            centered: true,
            width: 223,
            height: 272,
            layout: 'vbox',
            stopMaskTapEvent : false,
            title: '',
            items:[
                 this.suggestButton,
                 this.reviewButton,
                 this.askButton,
                 this.commentButton,
                 this.opened,
                 this.ind,
                 this.followButton,
                 this.unfollowButton,
                 this.replyButton,
                 this.upButton,
                 this.downButton,
                 this.threadButton,
                 this.locButton,
                 this.cancelButton,
            ]
        });
        		
     // top tool bar
		this.statusToolbar = new Ext.Toolbar({
			title: 'Status',
			dock: 'top',
		});
        
     // overlay
        this.status = new Ext.Panel({
            floating: true,
            modal: true,
            centered: true,
            width: 200,
            height: 200,
            stopMaskTapEvent : false,
            title: '',
            items:[
                 {html: "<div style='padding: 1em; font-size: medium'>Sent! Please see the replies to your post in my feeds. Click anywhere outside of the panel to dismiss this note</div>"}
            ],
            dockedItems: [this.statusToolbar],
        });
		
		FlyTalk.views.BoredView.superclass.initComponent.call(this);
        
    },
    
    suggestButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openSuggest'
        });
    },
    
    reviewButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openReview'
        });
    },
    
    askButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openQuestion'
        });
    },
    
    commentButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openComment'
        });
    },
    
    followButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

    	Ext.dispatch({
            controller: FlyTalk.controllers.dbController,
            action: 'follow',
            index: this.ind.title,
        });
    },
    
    unfollowButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

    	Ext.dispatch({
            controller: FlyTalk.controllers.dbController,
            action: 'unfollow',
            index: this.ind.title,
        });
    },
    
    replyButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

    	Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openReply',
            index:  this.ind.title,
        });
        
    },
    
    upButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

    	Ext.dispatch({
            controller: FlyTalk.controllers.dbController,
            action: 'up',
            index: this.ind.title,
        });
    },
    
    downButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();

    	Ext.dispatch({
            controller: FlyTalk.controllers.dbController,
            action: 'down',
            index: this.ind.title,
        });
    },
    
    threadButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();
    	
    	Ext.dispatch({
            controller: FlyTalk.controllers.dbController,
            action: 'openThread',
            index:  this.ind.title,
        });
    },
    
    locButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();
    	
    	Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openLoc',
            index:  this.ind.title,
        });
    },
    
    cancelButtonTap: function () {
    	FlyTalk.views.BoredView.overlay.hide();
    },
    
    calcHeight: function(){
    	var height = 1;
    	/*
    	if(!this.suggestButton.isHidden()){
    		height++;
    	}
    	
    	
    	if(this.reviewButton.isVisible()){
    		height++;
    	}
    	
    	if(this.askButton.isVisible()){
    		height++;
    	}
    	
    	if(this.commentButton.isVisible()){
    		height++;
    	}
    	
    	if(this.followButton.isVisible()){
    		height++;
    	}
    	
    	if(this.unfollowButton.isVisible()){
    		height++;
    	}
    	
    	if(this.replyButton.isVisible()){
    		height++;
    	}
    	
    	if(this.upButton.isVisible()){
    		height++;
    	}
    	
    	if(this.downButton.isVisible()){
    		height++;
    	}
    	
    	if(this.threadButton.isVisible()){
    		height++;
    	}*/
    	
    	return 250;
    }
});